JavaScript 30 Days Challenge Key Sequence Detection 구현 사항: 비밀번호 입력 기능 구현 1) 입력된 문자열을 저장할 배열과 맞춰야 하는 비밀번호를 각각 변수에 할당 2) keyup 이벤트 발생 시 pressed에 할당된 배열에 누른 키를 저장 만약 'a'를 눌렀을 시 pressed = ['a']가 됨 3) pressed에 저장된 요소들의 개수가 비밀번호 문자열의 length를 넘어가는 경우, splice()를 이용하여 가장 먼저 배열에 들어... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge References VS Copying 구현 사항: 배열과 객체의 복사 방법 익히기 1) 변수에 원시값(단순 데이터)을 할당하는 것은 아래 그림과 같이 값 그 자체를 접근하는 것이며, let num2 = num;과 같은 방식으로 값 할당 후 num2의 값을 다른 원시값으로 바꿔 할당하여도 num이 바뀌지 않는다. 2) 배열, 객체와 같은 참조값은 참조로 접근하는 것이며, team에 players 배열을 할당하는 것은 team이 p... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Flex Panel Gallery 2) 각각의 카드 하나하나에 모두 들어간 .panel class에 아래와 같이 속성 추가 .panel class의 첫번째, 마지막 자식 요소는 Y축 방향으로 각각 -100%, 100%으로 이동시키고, 만약 .open-active class가 추가된다면 각각 0, 0으로 이동하도록 함 5) .panel.open class에 flex: 5; 속성 할당 -> open된 상태일 때 카드의 크기가 커... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Fun with HTML5 Canvas 2) canvas에 무엇인가를 표시하려면 렌더링 컨텍스트에 접근해야 함 -> 변수 cts에 getContext() 사용하여 그리기 메소드와 속성을 가진 context를 할당하며, 메소드의 인자로 "2d"를 명시 5) draw() 함수 선언, mousemove 이벤트 발생 시 실행 -> 마우스가 브라우저 내에서 움직일 시 함수 실행 현재 그림을 그리고 있는 상태인지를 표시하기 위한 변수 isD... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Array Cardio Day 1 2) Give us an array of the inventors first and last names: inventors의 첫번째, 마지막 이름을 콘솔에 출력하라. 3) Sort the inventors by birthdate, oldest to youngest: inventors를 생년에 따라 가장 나이 든 사람부터 젊은 사람 순으로 정렬하라. 다음과 같은 코드가 있을 때, a-b가 0보... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge
Key Sequence Detection 구현 사항: 비밀번호 입력 기능 구현 1) 입력된 문자열을 저장할 배열과 맞춰야 하는 비밀번호를 각각 변수에 할당 2) keyup 이벤트 발생 시 pressed에 할당된 배열에 누른 키를 저장 만약 'a'를 눌렀을 시 pressed = ['a']가 됨 3) pressed에 저장된 요소들의 개수가 비밀번호 문자열의 length를 넘어가는 경우, splice()를 이용하여 가장 먼저 배열에 들어... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge References VS Copying 구현 사항: 배열과 객체의 복사 방법 익히기 1) 변수에 원시값(단순 데이터)을 할당하는 것은 아래 그림과 같이 값 그 자체를 접근하는 것이며, let num2 = num;과 같은 방식으로 값 할당 후 num2의 값을 다른 원시값으로 바꿔 할당하여도 num이 바뀌지 않는다. 2) 배열, 객체와 같은 참조값은 참조로 접근하는 것이며, team에 players 배열을 할당하는 것은 team이 p... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Flex Panel Gallery 2) 각각의 카드 하나하나에 모두 들어간 .panel class에 아래와 같이 속성 추가 .panel class의 첫번째, 마지막 자식 요소는 Y축 방향으로 각각 -100%, 100%으로 이동시키고, 만약 .open-active class가 추가된다면 각각 0, 0으로 이동하도록 함 5) .panel.open class에 flex: 5; 속성 할당 -> open된 상태일 때 카드의 크기가 커... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Fun with HTML5 Canvas 2) canvas에 무엇인가를 표시하려면 렌더링 컨텍스트에 접근해야 함 -> 변수 cts에 getContext() 사용하여 그리기 메소드와 속성을 가진 context를 할당하며, 메소드의 인자로 "2d"를 명시 5) draw() 함수 선언, mousemove 이벤트 발생 시 실행 -> 마우스가 브라우저 내에서 움직일 시 함수 실행 현재 그림을 그리고 있는 상태인지를 표시하기 위한 변수 isD... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge Array Cardio Day 1 2) Give us an array of the inventors first and last names: inventors의 첫번째, 마지막 이름을 콘솔에 출력하라. 3) Sort the inventors by birthdate, oldest to youngest: inventors를 생년에 따라 가장 나이 든 사람부터 젊은 사람 순으로 정렬하라. 다음과 같은 코드가 있을 때, a-b가 0보... JavaScript 30 Days ChallengeJavaScript 30 Days Challenge